<template>
  <el-container>
    <el-main>
      <el-form :model="editItem" label-width="100px" style="margin:30px auto; width:600px;">
        <el-form-item label="系统标题">
          <el-input v-model="editItem.title" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="系统描述">
          <el-input v-model="editItem.description" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="版权描述">
          <el-input v-model="editItem.copyright" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="备案描述">
          <el-input v-model="editItem.icp" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="首页地址">
          <el-input v-model="editItem.homeUri" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="默认应用代码">
          <el-input v-model="editItem.defaultAppId" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="logo">
          <mf-fileUpload
            v-model="logoIds"
            showFileList
            showPreview
            :mimeTypes="mimeTypes">
          </mf-fileUpload>
          <el-button type="text" @click="showSetLogo=true">从已有文件中选择</el-button>
        </el-form-item>
        <el-form-item label="icon">
          <mf-fileUpload
            v-model="iconIds"
            showFileList
            showPreview
            :mimeTypes="['image/x-icon']">
          </mf-fileUpload>
          <el-button type="text" @click="showSetIcon=true">从已有文件中选择</el-button>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="save">确 定</el-button>
        </el-form-item>
      </el-form>
      <mf-selectFile :visible.sync="showSetLogo" @fileSelected="setLogo" :fileTypes="['.png','.jpg','.gif']"></mf-selectFile>
      <mf-selectFile :visible.sync="showSetIcon" @fileSelected="setIcon" :fileTypes="['.ico']"></mf-selectFile>
    </el-main>
  </el-container>
</template>
<script>
export default {
  data(){
    return {
      showSetLogo: false,
      showSetIcon: false,
      editItem:{
        title: null,
        description: null,
        copyright: null,
        icp: null,
        icon: null,
        logo: null,
        theme: null,
        warningUri: null,
        builtinUrls: [],
        defaultAppId: null,
        homeUri: null
      },
      mimeTypes: [
        'image/jpeg',
        'image/png'
      ],
      logoIds: [],
      iconIds: []
    }
  },
  computed: {

  },
  created(){
    this.$service.administration.loadEnvConfig().then((r)=>{
      if (r.success){
        for(var name in r.data){

          this.editItem[name] = r.data[name];
        }
        if (this.editItem.logo)
          this.logoIds = [this.editItem.logo];

        if (this.editItem.icon)
          this.iconIds = [this.editItem.icon];

      }
    });
  },
  methods:{
    save(){
      if (this.logoIds && this.logoIds.length > 0)
        this.editItem.logo = this.logoIds[0];
      if (this.iconIds && this.iconIds.length > 0)
        this.editItem.icon = this.iconIds[0];
      this.$service.administration.saveEnvConfig({data: this.editItem}).then(r => {
        if(r.success){
          success("操作成功");
        }
      });
    },
    setLogo(file){
      this.logoIds = [file.fileId];
    },
    setIcon(file){
      this.iconIds = [file.fileId];
    }
  }
}
</script>
